 {include file="public/header" type="other"/}
  	{include file="public/footer"/}
 <style>
 	@media(max-width:760px) {
 		.layui-form-label {
 			float: unset;
 			display: unset;
 			padding: unset;
 			width: unset;
 			font-weight: unset;
 			line-height: unset;
 			text-align: unset;
 		}

 		.layui-input-block {
 			margin-left: unset;
 			min-height: unset;
 		}
 	}
 </style>
 	<form class="layui-form" action="">
 		<div class="mainBox">
 			<div class="main-container">
 			    <div class="layui-form-item">
					<label class="layui-form-label">
						套餐图标
					</label>
					<div class="layui-input-block" style="position: relative;">
					                
 										<button style="position: absolute;right: 0;" class="pear-btn pear-btn-primary pear-btn-sm  upload-image"
 											type="button">
 											<i class="fa fa-image">
 											</i>
 											上传图片
 										</button>
 										<input class="layui-input" placeholder="不设置展示默认图标" lay-verify="uploadIcon"  name="icon" 
 											value="{$model['icon']??''}" />
 										<div class="upload-image">
 											<span>
 											</span>
 											<img class="upload-image" src="{$model['icon']??''}" />
 										</div>
 									</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">
						头像框
					</label>
					<div class="layui-input-block" style="position: relative;">
					                
 										<button style="position: absolute;right: 0;" class="pear-btn pear-btn-primary pear-btn-sm  upload-image"
 											type="button">
 											<i class="fa fa-image">
 											</i>
 											上传图片
 										</button>
 										<input class="layui-input" placeholder="不设置不显示头像框"  lay-verify="uploadAvatar"  name="avatar_frame" 
 											value="{$model['avatar_frame']??''}" />
 										<div class="upload-image">
 											<span>
 											</span>
 											<img class="upload-image" src="{$model['avatar_frame']??''}" />
 										</div>
 									</div>
				</div>
 				<div class="layui-form-item">
 					<label class="layui-form-label">
 						套餐名称
 					</label>
 					<div class="layui-input-block">
 						<input type="text" class="layui-input layui-form-danger" placeholder="例如:VIP" name="name"
 						 value="{$model['name']??""}" />
 					</div>
 				</div>
 				<div class="layui-form-item">
 					<label class="layui-form-label">
 						套餐费率
 					</label>
 					<div class="layui-input-block">
 						<input type="text" class="layui-input layui-form-danger" placeholder="费率范围设置项:0-100"
 							name="feilv"  value="{$model['feilv']??""}" />
 					</div>
 				</div>
 				<div class="layui-form-item">
 					<label class="layui-form-label">
 						套餐金额
 					</label>
 					<div class="layui-input-block">
 						<input type="text" class="layui-input layui-form-danger" name="money" 
 							value="{$model['money']??""}" />
 					</div>
 				</div>
 				<div class="layui-form-item">
 					<label class="layui-form-label">
 						套餐时间
 					</label>
 					<div class="layui-input-block">
 						<input type="text" class="layui-input layui-form-danger" placeholder="填写实际数字即可,例:888"
 							name="viptime"  value="{$model['viptime']??""}" />
 					</div>
 				</div>
 				<div class="layui-form-item">
 					<label class="layui-form-label">额外功能</label>
 					<div class="layui-input-block">
 						<table class="layui-table">
 							<thead>
 								<tr>
 									<th>名称</th>
 									<th>操作</th>
 									<th>配置项</th>
 								</tr>
 							</thead>
 							<tbody>
 								<tr>
									<td>
										<span>订单加费</span>
									</td>
									<td>
										<input type="checkbox" name="is_profiteer" lay-skin="switch" {if
 											condition="$model['is_profiteer'] eq 1" } checked {/if} lay-text="开|关">
									</td>
									<td>
										<div id="profiteer" >
											<div class="layui-form-item">
												开启之后用户的费率将由用户的客户支付,但是用户仍需要充值余额
											</div>
										</div>
									</td>
								</tr>
								<tr>
									<td>
										<span>通道限制</span>
									</td>
									<td>
										<input type="checkbox" name="is_addChannelNum" lay-text="开|关" {if
 											condition="$model['is_addChannelNum'] eq 1" } checked {/if} lay-skin="switch" lay-text="开|关"
											lay-filter="is_addChannelNum">
									</td>
									<td>
										<div id="addChannelNum" {if condition="$model['is_addChannelNum'] neq 1" }
										style="pointer-events: none;" {/if}>
											<div class="layui-form-item">
												<label class="layui-form-label">
													限制添加通道
												</label>
												<div class="layui-input-block">
													<input type="text" class="layui-input layui-form-danger"
													placeholder="填写实际数字即可,例如:3(只能添加3个通道)" value="{$model['addChannelNum']??'0'}"	name="addChannelNum" />
												</div>
											</div>
										</div>
									</td>
								</tr>
 								<tr>
 									<td>
 										<span>收款限额</span>
 									</td>
 									<td>
 										<input type="checkbox" name="is_quota" lay-skin="switch" lay-text="开|关" {if
 											condition="$model['is_quota'] eq 1" } checked {/if} lay-filter="quota">
 									</td>
 									<td>
 										<div name="quota" {if condition="$model['is_quota'] neq 1" }
 											style="pointer-events: none;" {/if}>
 											<div class="layui-form-item">
 												<label class="layui-form-label">
 													日收款限额
 												</label>
 												<div class="layui-input-block">
 													<input type="text" class="layui-input layui-form-danger"
 														name="today_quota" placeholder="填写实际数字即可,例如:100" value="{$model['today_quota']??'0'}" />
 												</div>
 											</div>
 										</div>
 										<div name="quota" {if condition="$model['is_quota'] neq 1" }
 											style="pointer-events: none;" {/if}>
											<div class="layui-form-item">
												<label class="layui-form-label">
													月收款限额
												</label>
												<div class="layui-input-block">
													<input type="text" class="layui-input layui-form-danger"
													placeholder="填写实际数字即可,例如:100"	name="moon_quota" value="{$model['moon_quota']??'0'}"/>
												</div>
											</div>
										</div>
 									</td>
 								</tr>
 								<tr>
 									<td>
 										<span>通道绑定</span>
 									</td>
 									<td>
 										<input type="checkbox" name="is_passage" lay-skin="switch" lay-text="开|关" {if
 											condition="$model['is_passage'] eq 1" } checked {/if} lay-filter="passage">
 									</td>
 									<td>
 										<div id="passage" {if condition="$model['is_passage'] neq 1" }
 											style="pointer-events: none; " {/if}>
 											<div class="layui-form-item">
 												<label class="layui-form-label">
 													选择绑定通道
 												</label>

 												<div class="layui-input-block">
 													<div id="channel"></div>
 												</div>
 											</div>
 										</div>
 									</td>
 								</tr>
 							</tbody>
 						</table>
 					</div>
 				</div>
 			</div>
 		</div>
 		<div class="bottom">
 			<div class="button-container">
 				<button type="submit" class="layui-btn layui-btn-normal layui-btn-sm" lay-submit="" lay-filter="save">
 					<i class="layui-icon layui-icon-ok"></i>
 					提交
 				</button>
 				<button type="reset" class="layui-btn layui-btn-primary layui-btn-sm">
 					<i class="layui-icon layui-icon-refresh"></i>
 					重置
 				</button>
 			</div>
 		</div>
 	</form>

 	<script>
 		layui.use(['form', 'jquery','uploads',  'xmSelect'], function() {
 			let form = layui.form;
 			let $ = layui.jquery;
 			let xmSelect = layui.xmSelect;
            let MODULE_PATH = "{$Request.root}/ypay.vip/";
 			var channel = xmSelect.render({
 				el: '#channel',
 				autoRow: true,
 				filterable: true,
 				tree: {
 					show: true,
 					showFolderIcon: true,
 					showLine: true,
 					indent: 20,
 				},
 				toolbar: {
 					show: true,
 					list: ['ALL', 'REVERSE', 'CLEAR']
 				},
 				filterable: true,
 				height: 'auto',
 				data: []
 			})
            
            $.ajax({
	            type: 'post',
	            url: MODULE_PATH + 'getChannel',
	            success: function(res) {
						channel.update({
		                    data: res.data,
		                    autoRow: true,
	                    })
	                    channel.setValue([{:strip_tags($model.passages??0)}]);
					}
            });
            
            form.on("switch(is_addChannelNum)", function(data) {
				var addChannelNum = data.elem.checked ? 1 : 0;
				if (addChannelNum == 1) {
					$('#addChannelNum').css("pointer-events", "auto");
				} else {
					$('#addChannelNum').css("pointer-events", "none");
				}
			});

 			form.on("switch(quota)", function(data) {
				var quota = data.elem.checked ? 1 : 0;
				if (quota == 1) {
					$('div[name="quota"]').css("pointer-events", "auto");
				} else {
					$('div[name="quota"]').css("pointer-events", "none");
				}
			});
 			form.on("switch(passage)", function(data) {
 				var passage = data.elem.checked ? 1 : 0;
 				if (passage == 1) {
 					$('#passage').css("pointer-events", "auto");
 				} else {
 					$('#passage').css("pointer-events", "none");
 				}
 			});

 			//建立编辑器

 			form.on('submit(save)', function(data) {
 				if (data.field.is_profiteer == null || data.field.is_profiteer == '') {
					data.field.is_profiteer = 0;
				} else {
					data.field.is_profiteer = 1;
				}
				if (data.field.is_addChannelNum == null || data.field.is_addChannelNum == '') {
					data.field.is_addChannelNum = 0;
				} else {
					data.field.is_addChannelNum = 1;
					if(data.field.addChannelNum == null || data.field.addChannelNum == ''){
 					    layer.msg('可添加通道次数不能为空', {
									icon: 2,
									time: 1000
								});
						return false;
 					}
				}
 				if (data.field.is_passage == null || data.field.is_passage == '') {
 					data.field.is_passage = 0;
 				} else {
 					data.field.is_passage = 1;
 				}
 				if (data.field.is_quota == null || data.field.is_quota == '') {
 					data.field.is_quota = 0;
 				} else {
 					data.field.is_quota = 1;
 					if(data.field.today_quota == null || data.field.today_quota == ''){
 					    layer.msg('日收款限额不能为空', {
									icon: 2,
									time: 1000
								});
						return false;
 					}
 					
 					if(data.field.moon_quota == null || data.field.moon_quota == ''){
 					    layer.msg('月收款限额不能为空', {
									icon: 2,
									time: 1000
								});
						return false;
 					}
 				}
 				$.ajax({
 					data: JSON.stringify(data.field),
 					dataType: 'json',
 					contentType: 'application/json',
 					type: 'post',
 					success: function(res) {
 						//判断有没有权限
 						if (res && res.code == 999) {
 							layer.msg(res.msg, {
 								icon: 5,
 								time: 2000,
 							})
 							return false;
 						} else if (res.code == 200) {
 							layer.msg(res.msg, {
 								icon: 1,
 								time: 1000
 							}, function() {
 								parent.layer.close(parent.layer.getFrameIndex(window
 									.name)); //关闭当前页
 								parent.layui.table.reload("vip");
 							});
 						} else {
 							layer.msg(res.msg, {
 								icon: 2,
 								time: 1000
 							});
 						}
 					}
 				})
 				return false;
 			});
 		})
 	</script>
 </body>
 </html>
